<!DOCTYPE html>
<html lang="zh-CN">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <!-- 样式 -->
    <style>
      button {
        background-color: gray;
        font-size: 30px;
        border: 0;
        padding: 10px;
        color: white;
      }
    </style>
  </head>
  <body>
    <!-- 结构 -->
    <button>预测序列</button>
    <!-- 行为 -->
    <script>
      document.querySelector("button").onclick = function () {
        var textArr = [
          "占卜家",
          "学徒",
          "偷盗者",
          "秘祈人",
          "观众",
          "水手",
          "歌颂者",
          "阅读者",
          "战士",
          "不眠者",
          "收尸人",
          "猎人",
          "刺客",
          "通识者",
          "窥秘人",
          "怪物",
          "药师",
          "耕种者",
          "恶棍",
          "仲裁人",
          "律师",
          "掮客",
          "囚犯",
          "罪犯",
          "吝啬鬼",
          "舞蹈家",
          "失梦人",
          "天文爱好者",
          "流浪汉",
          "萨满",
          "演讲者",
          "病患",
        ];
        var timer = -1;
        var time = 10;
        timer = setInterval(() => {
          time--;
          if (time == 0) {
            clearInterval(timer);
          }
          var index = Math.floor(Math.random() * textArr.length);
          console.log("你的序列是" + textArr[index]);
        }, 1000);
      };
    </script>
  </body>
</html>
